import React, { useEffect, useState } from 'react';
import { Row, Col, Table, Tooltip, Button, Input, Space, Select } from 'antd';
import { SearchOutlined } from '@ant-design/icons';
import { Get } from '../../server/http';
import { Url } from '../../server/http';

const { Search } = Input;

const Summary = () => {
	const [township, setTownship] = useState([]);   // 乡镇补贴汇总
	const [category, setCategory] = useState([]);   // 各类补贴人数
	// 初始化数据
	useEffect(() => {
		getTownshipSubsidy()
		getSubsidy()
	}, []);


	// 乡镇补贴金额
	const getTownshipSubsidy = () => {
		Get(Url.TOWNSHIP_SUBSIDY_STATISTIC,).then(
			data => {
				if (data?.status === 'success') {
					let list = data?.data
					const arr = {'点军': '点军街道', '桥边': '桥边镇', "艾家": "艾家镇", "土城": "土城乡", "联棚": "联棚乡"}
					let info = {}
					for (let k in list) {
						let temp = 0
						for (let m in list[k]) {
							if (list[k][m]) {
								for (let n in list[k][m]) {
									if (list[k][m][n]) {
										temp += list[k][m][n]
									}
								}
							}
							info[arr[m]] = temp
						}
					}
					getTownData(info)
				}
			}
		)
	}
	// 获取各乡镇人数
	const getTownData = (tempData) => {
		Get(Url.TOWN_PEOPLE,).then(
			data => {
				if (data?.status === 'success') {
					let list = data?.data
					const arr = {'点军': '点军街道', '桥边': '桥边镇', "艾家": "艾家镇", "土城": "土城乡", "联棚": "联棚乡"}
					let info = []
					for (let k in list) {
						let temp = 0
						for (let m in list[k]) {
							if (list[k][m]) {
								for (let n in list[k][m]) {
									if (list[k][m][n]) {
										temp += list[k][m][n]
									}
								}
							}
							info.push({name: arr[m], people: temp, money: tempData[arr[m]] || 0})
						}
					}
					setTownship(info)
				}
			}
		)
	}

	// 各类补贴金额
	const getSubsidy = () => {
		Get(Url.SUBSIDY_STATISTIC,).then(
			data => {
				if (data?.status === 'success') {
					let list = data?.data
					let temp = {
						'生态': Math.floor(list['ecological']) || 0,
						'高龄': Math.floor(list['elderly']) || 0,
						'耕地': Math.floor(list['farmland']) || 0,
						'移民': Math.floor(list['immigration']) || 0,
						'就业': Math.floor(list['employment']) || 0,
						'灵活就业': Math.floor(list['flex_employment']) || 0,
						'实习': Math.floor(list['intership']) || 0,
					}
					getSubsidySort(temp)
				}
			}
		)
	}
	// 各类补贴人数
	const getSubsidySort = (tempData) => {
		Get(Url.SUBSIDY_SORT,).then(
			data => {
				if (data?.status === 'success') {
					let temp = []
					const arr = {
						elderly: '高龄', immigration: '移民', flex_employment: "灵活就业",
						farmland: "耕地", ecological: "生态", intership: '实习',
						employment: "就业", student: '学生就业'
					}
					temp = data?.data.reverse();
					for (let k in temp) {
						temp[k]['name'] = arr[temp[k]['key']]
						temp[k]['money'] = tempData[arr[temp[k]['key']]]
					}
					setCategory(temp)
				}
			}
		)
	}


	// 表格列定义
	const townColumns = [
		{
			title: '序号',
			dataIndex: 'member_id',
			key: 'member_id',
			width: '10%',
			render: (text, record, index) => index+1
		},
		{
			title: '区域名称',
			dataIndex: 'name',
			key: 'name',
			width: '30%',
		},
		{
			title: '补贴总人数',
			dataIndex: 'people',
			key: 'people',
			width: '30%',
		},
		{
			title: '补贴总金额(元)',
			dataIndex: 'money',
			key: 'money',
			width: '30%',
		},
	];
	const categoryColumns = [
		{
			title: '序号',
			dataIndex: 'member_id',
			key: 'member_id',
			width: '10%',
			render: (text, record, index) => index+1
		},
		{
			title: '类别',
			dataIndex: 'name',
			key: 'name',
			width: '30%',
		},
		{
			title: '补贴总人数',
			dataIndex: 'value',
			key: 'value',
			width: '30%',
		},
		{
			title: '补贴总金额(元)',
			dataIndex: 'money',
			key: 'money',
			width: '30%',
		},
	];

	return (
		<div >
			<Row type={'flex'}>
				<Col span={12} style={{paddingRight: '1vw'}}>
					<Row style={{marginBottom: '1vh', fontSize: '16px', fontWeight: 'bold'}}>乡镇补贴汇总</Row>
					<Table
						key={'member_1'}
						size={'small'}
						columns={townColumns}
						dataSource={township}
						pagination={false}
						bordered
					/>
				</Col>
				<Col span={12}>
					<Row style={{marginBottom: '1vh', fontSize: '16px', fontWeight: 'bold'}}>各类补贴汇总</Row>
					<Table
						key={'member_2'}
						size={'small'}
						columns={categoryColumns}
						dataSource={category}
						pagination={false}
						bordered
					/>
				</Col>
			</Row>

		</div>
	);
};

export default Summary;
